<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>h5定位</title>
</head>
<body>
<div id="app">
    <h4 style="color:#999999 ;margin-left:auto;margin-right:auto;margin-top:50px;text-align:center;">
        正在使用H5定位...</h4>
    <h4 id="loc">定位结果?</h4>
</div>
<script>
    window.onload=function(){
        if (navigator.geolocation){
            navigator.geolocation.getCurrentPosition(showPosition,showError);

            document.getElementById('loc').innerHTML = "aa";
        }else{
            alert("浏览器不支持地理定位");
        }
    }

    function showError(error){
        console.log(error)
        switch(error.code) {
            case error.PERMISSION_DENIED:
                alert("定位失败,用户拒绝请求地理定位");
                break;
            case error.POSITION_UNAVAILABLE:
                alert("定位失败,位置信息是不可用");
                break;
            case error.TIMEOUT:
                alert("定位失败,请求获取用户位置超时");
                break;
            case error.UNKNOWN_ERROR:
                alert("定位失败,定位系统失效");
                break;
        }
    }

    function showPosition(position){
        console.log(position)
        var lat = position.coords.latitude; //纬度
        var lag = position.coords.longitude; //经度
        alert('纬度:'+lat+',经度:'+lag);
    }
</script>
</body>
</html>